<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <h1> mr. yuan is awesome</h1>
  <button>change</button>
  <script>
    var h1 = document.querySelector('h1')
    var btn = document.querySelector('button')
    //死循环指定的时间
    function delay(duration) {
      var start = Date.now()
      while (Date.now() - start < duration) { }
    }

    btn.onclick = function () {
      h1.textContent = '袁老师很帅！'
      delay(3000)
    } 
  </script>

</body>

</html>